<template>
    <div class="page-office-list">
      <van-tree-select
        :height="'100%'"
        :items="list"
        :active-id.sync="activeId"
        :main-active-index.sync="activeIndex"
        @click-item="selectOffice"
      />
    </div>
  </template>
  <script>
  export default {
    data(){
      return {
        activeId: 1,
        activeIndex: 0,
        list: [
          // { text: '外科', id: 1, children: [
          //   {text:'外科1',id: 11},
          //   {text:'外科2',id:12},
          // ]},
          // { text: '内科', id: 2, children: [
          //   {text:'内科1', id: 21},
          //   {text:'内科2', id: 22},
          // ]},
        ],
      }
    },
    created(){
      this.getOfficeTree();
    },
    methods:{
      getOfficeTree(){
        this.$http('get','/admin/officeApi/tree', {}, (data,msg) => {
          this.list = this.getArray(data);
          this.list = this.list.map(item => {
            if(!item.hasOwnProperty('children')){
              item.children = this.getArray([item])
            }
            return item;
          })
        })
      },
      getArray(list){
        let arr = list.map(item => {
          item.text = item.name;
          if(item.hasOwnProperty('children')){
            item.children = this.getArray(item.children);
          }
          return item;
        });
        return arr;
      },
      selectOffice(e){
        console.log(e);
        this.activeId = e.id;
        this.$util.gotoPage('/doctor/list', {patientId:this.$route.query.patientId, officeId:e.id, officeName: e.name})
      }
    }
  }
  </script>